<template>
    <div>
        <NuxtLayout name="header" />
        <NuxtLink to="/detail">进入列表页</NuxtLink>
    </div>
</template>

<script setup>
const route = useRoute()
const router = useRouter();
// router.back();
// router.forward();
// router.go();
// router.push({ path: "/home" });
// router.replace({ hash: "#bio" });

const foo = useFoo()
const appConfig = useAppConfig() //访问项目中的 Nuxt 配置
console.log(appConfig)

// 在页面、组件和插件中，您可以使用 useAsyncData 来访问异步返回的数据；

// useFetch是对useAsyncData包装，自动生成key同时推断响应类型，用起来更简单。
const param1 = ref('value1')
const { data, pending, error, refresh } = await useFetch('https://api.nuxtjs.dev/mountains', {
    query: { param1, param2: 'value2' }
})
const { data: mountain } = await useFetch(`https://api.nuxtjs.dev/mountains/${route.params.slug}`)
</script>